<template>
  <div class="container">
    <view-box ref="viewBox" body-padding-top="46px" body-padding-bottom="53px">
      <x-header class="my-header" >设置</x-header>
      <group>
        <panel :footer="footer" :list="list" type="3"></panel>
      </group>
      <group style="position: absolute;bottom: 20px;width: 100%">
        <x-button :gradients="['#FF2719', '#FF61AD']" @click.native="layout()">退出登录</x-button>
      </group>
    </view-box>
    <toast v-model="success" type="text" :time="1500" is-show-mask text="退出成功" position="bottom"></toast>
  </div>
</template>

<script>
  import {Panel,XButton,Toast,Group,Radio,Datetime,XHeader,ViewBox} from 'vux'
  export default {
    data(){
      return{
        success:false,
        list:[
          {
            title: '帮助中心',
            desc: '',
            url: 'http://manage.hellohushi.com/#/protocol/user'
          },{
            title: '关于平台',
            desc: '',
            url: 'http://manage.hellohushi.com/#/protocol/nurse'
          },
        ]
      }
    },
    mounted(){

    },
    methods:{
      //退出登录
      layout(){
        this.setCookie('uid','',365)
        this.setCookie('token','',365)
        this.setCookie('refreshToken','',365)
        this.success=true
        setTimeout(()=>{
          this.$router.push('/')
        },1500)
      }
    },
    components:{
      Panel,XButton,Toast,Group,Radio,Datetime,XHeader,ViewBox
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .my-header {
    background-color: rgb(255, 104, 140);
    position: fixed;
    height: 46px;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100;
  }
</style>
